<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>子元素节点</title>
</head>
<body>
<ul>
  <li>我是li</li>
  <li>我是li</li>
  <li>我是li</li>
  <li>我是li</li>
</ul>
<script>
  // 2. children 获取所有的子元素节点(不包括文本节点等）也是我们实际开发常用的
  const ul = document.querySelector('ul')
  console.log(ul.children);
  //2.firstElementChild 获取第一个子元素节点 ie9以上才支持
  console.log(ul.firstElementChild)
  //3.lastElementChild 获取最后一个子元素节点 ie9以上才支持
  console.log(ul.lastElementChild)
  //4.children[0] 开发中经常使用 没有兼容问题并且返回第一个子元素
  console.log(ul.children[0])
  console.log(ul.children[children.length-1])
</script>
</body>
</html>
